<template>
	<view class="movieBody">
		<block v-for="(body,bodyIndex) in movieListData" :key="bodyIndex">
			<view class="hotMovie">
				<view id="more" class="view">
					<movieTitle :title="body.title" :url="body.url"></movieTitle>
					<scroll-view scroll-x scroll-with-animation show-scrollbar>
						<view class="swiper-wrapper-content">
							<block v-for="(item,index) in body.movieListInfo" :key="item.id">
								<movieList :MonvieItem="item"></movieList>
							</block>
						</view>
					</scroll-view>
				</view>
			</view>
		</block>
	</view>
</template>
<script>
	import movieList from '../../components/movieList/movieList.vue';
	import movieTitle from '../../components/movieTitle/movieTitle.vue';
	export default {
		data() {
			return {

			}
		},
		props: {
			movieListData: Array
		},
		components: {
			movieList,
			movieTitle
		},
		onReady() {

		}
	}
</script>
<style lang="scss" scoped>
	.hotMovie {

		.h1 {
			font-size: 48upx;
			font-weight: 500;
			margin: 34upx 0 10upx 0;
			padding-left: 36upx;
			box-sizing: border-box;
		}

	}

	.swiper-wrapper-content {
		display: flex;
		width: auto;
	}

	.head {
		height: 24px;
		display: flex;
		padding-top: 20upx;
		justify-content: space-between;
		padding-right: 18px;
		margin-bottom: 20upx;
		margin-left: 20upx;

		.left {
			font-size: 38upx;
		}

		.right {
			font-size: 28upx;
			color: #42bd56;
		}
	}
</style>
